<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<!-- jQuery-easyui -->
	<jsp:include page="/include/jQuery.easyui.lib.jsp"></jsp:include>
</head>
<body class="easyui-layout">
	
	<div id="dataGrid" region="center" style="padding:10px;" border="false">
		<table id="tt" fit="true">
			<thead>
				<tr>
					<th field="parent" width="180" sortable="true">一级分类</th>
					<th field="name" width="180" sortable="true">二级分类</th>
					<th field="opt" width="120" formatter="fmtOpt" align="center">操作</th>
				</tr>
			</thead>
		</table>
	</div>
	
	<div id="opPanel" closed="true" region="center" style="padding:10px;" border="false">
		<!-- panel href -->
	</div>
	
	<div id="queryWindow" style="padding:10px;" border="false">
		<!-- window href -->
	</div>
	
	<script type="text/javascript">
		
		$(function(){
			toGrid();
		});
		
		function toGrid(){
			$('#tt').datagrid({
				url: 'classify.action?command=grid',
				striped: true,
				rownumbers: true,
				pagination: true,
				pageSize: 10,
				pageList: [10,20,30],
				sortName: 'id',
				sortOrder: 'desc',
				idField: 'id',
				frozenColumns:[[
	                {field:'ck',checkbox:true}/* ,
	                {title:'编号',field:'id',width:120,sortable:true} */
				]], 
				onSelect: function(rowIndex, rowData){
		    		setBtn(false);
				},
				onUnselect: function(rowIndex, rowData){
					var rows = $('#tt').datagrid('getSelections');
					if(rows==null || rows.length==0){
						setBtn(true);
					}
				},
				onDblClickRow: function(rowIndex, rowData){
					hrefEdit(rowData.id);
				},
				toolbar:[{
					text: '新增',
					iconCls: 'icon-add',
					handler: btnAdd
				},'-',{
					text: '删除',
					disabled: true,
					iconCls:'icon-remove',
					handler: btnDelete
				}]
			});
		}
		
		// 菜单是否可用
		function setBtn(disable){
			$("a[myicon='icon-remove']").linkbutton({disabled:disable, plain:true});
			$("a[myicon='icon-edit']").linkbutton({disabled:disable, plain:true});
		}
		
		//清除所有选择
		function clearSels(){
			$('#tt').datagrid('clearSelections');
		}
		
		function fmtOpt(val, rec){
			var id = "'"+rec.id+"'";
			return '<span><a href="#" onclick="hrefEdit('+id
				+')">[编辑]</a>  <a href="#" onclick="hrefDelete('+id
				+')">[删除]</a>';
		}
		
		// 添加按钮
		function btnAdd(){
			$("#dataGrid").hide();
			$('#opPanel').panel({
				closed: false,
				href:'add.jsp'
			});
		}
		
		// 删除按钮
		function btnDelete(){
			var sels = $('#tt').datagrid('getSelections');
			var ids = "";
			for(var i in sels){
				ids += sels[i].id +",";
			}
			hrefDelete(ids);
		}
		
		// 编辑操作链接
		function hrefEdit(id){
			$("#dataGrid").hide();
			$('#opPanel').panel({
				closed: false,
				href: 'classify.action?command=query&id='+id
			});
		}
		
		// 删除操作链接
		function hrefDelete(id){
			$.messager.confirm('友情提示', '您确定要删除所选的记录吗?', function(r){
				clearSels();
			    setBtn(true);
				if(r){
					ajaxDelete(id);
				}
			});
		}
		
		// ajax删除操作
		function ajaxDelete(ids){
			var actionURL = "classify.action";
			var params = {
				command: "delete",
				ids: ids
			};
			
			$.get(actionURL, params, function(result){
    			if("true" == result){
					$.messager.alert("友情提示", "您的操作成功!", "info", function(){
						$('#tt').datagrid('reload');
					});
				}else{
					$.messager.alert("友情提示", "您的操作失败!", "error");
				}
  			}); 
		}
		
	</script>
	
</body>
</html>